<template>
	<view>
		<uni-forms ref="form" :modelValue="formData" :rules="rules">
			<uni-forms-item label="名称" name="name">
				<uni-easyinput type="text" v-model="formData.name" placeholder="分类名" />
			</uni-forms-item>
			<uni-forms-item label="详情" name="note">
				<uni-easyinput type="textarea" v-model="formData.note" placeholder="分类详情" />
			</uni-forms-item>
		</uni-forms>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				// 表单数据
				formData: {
					name: '',
					note: ''
				},
				rules: {
					// 对name字段进行必填验证
					name: {
						rules: [{
								required: true,
								errorMessage: '请输入标题',
							},
							{
								minLength: 2,
								maxLength: 20,
								errorMessage: '长度在 {minLength} 到 {maxLength} 个字符',
							}
						]
					},
					// 对email字段进行必填验证
					note: {
						rules: [{
							maxLength: 20,
							errorMessage: '长度最大不能超过{maxLength}',
						}]
					}
				}
			}
		},
		methods: {
			submit() {
				return this.$refs.form.validate()
			}
		}
	}
</script>

<style lang="scss">

</style>
